<!-- tree page start -->
<!--
以下样式加在引用该模板的页面中，通过传head值设置到_layout.html中
<link rel="stylesheet" href="${base}/template/common/css/tree/amazeui.tree.css"/>
<style>
    .am-tree .am-tree-item.am-tree-selected .am-tree-item-name .am-tree-label,
    .am-tree.am-tree-folder-select .am-tree-branch.am-tree-selected > .am-tree-branch-header .am-tree-branch-name .am-tree-label {
      background-color: #0c80ba;
      color: #fff;
    }
</style>
-->
<script type="text/javascript" src="${base}/template/common/js/tree/amazeui.tree.js"></script>
<ul class="am-tree" id="myTreeSelectableFolder" style="text-align: left;">
  <li class="am-tree-branch am-hide" data-template="treebranch">
    <div class="am-tree-branch-header">
      <button class="am-tree-branch-name">
        <span class="am-tree-icon am-tree-icon-folder"></span>
        <span class="am-tree-label"></span>
      </button>
    </div>
    <ul class="am-tree-branch-children"></ul>
    <div class="am-tree-loader"><span class="am-icon-spin am-icon-spinner"></span></div>
  </li>
  <li class="am-tree-item am-hide" data-template="treeitem">
    <button class="am-tree-item-name">
      <span class="am-tree-icon am-tree-icon-item"></span>
      <span class="am-tree-label"></span>
    </button>
  </li>
</ul>
<!-- tree page end -->
<script type="text/javascript">
  /*$(function(){
      var data = [
      {
        title: 'ƻ����˾',
        type: 'folder',
        attr: {
                  
                  classNames:'treefolder'
                },
        ppp: [
          {
            title: 'iPhone',
            type: 'item'
            
          },
          {
            title: 'iMac',
            type: 'item'
          },
          {
            title: 'MacBook Pro',
            type: 'item'
          },
          {
            title: 'ƻ����˾2',
            type: 'folder',

            ppp: [
              {
                title: 'iPhone2',
                type: 'item'
              },
              {
                title: 'iMac2',
                type: 'item'
              },
              {
                title: 'MacBook Pro2',
                type: 'item'
              }
            ]
          },
        ]
      },
      {
        title: '΢���˾',
        type: 'item'
      },
      {
        title: 'GitHub',
        type: 'item'
      }
    ];

    $('#myTreeSelectableFolder').tree({
      dataSource: function(options, callback) {
        // ģ���첽����
        setTimeout(function() {
          callback({data: options.ppp || data});
        }, 400);
      },
      multiSelect: true,//��ѡ
      cacheItems: true,//�������ṹ��Ϊfalse�Ļ���ÿ�������������ṹ
      folderSelect: false//�ļ��У����ڵ㣩��ѡ��ѡ�к�ѡ�и��ļ����������ӽڵ�

    });

    $('#myTreeSelectableFolder').on('loaded.tree.amui', function (event, data) {//�����¼�
      // do something with data: { selected: [array], target: [object] }
    });

    $('#myTreeSelectableFolder').on('selected.tree.amui', function (event, data) {//ѡ���¼�
      // do something with data: { selected: [array], target: [object] }
    });

    $('#myTreeSelectableFolder').on('closed.tree.amui', function (event, data) {//�رո����ڵ��¼�
      // do something with data: { selected: [array], target: [object] }
    });
  });*/
</script>